﻿@using Telerik.Web.Mvc
@using Telerik.Web.Mvc.UI
@using Presentation.Web.Admin
@model  IEnumerable<Domain.Dto.PicInfoDto>
@{
    var per = Html.HasUiPermission(this.ViewContext, "sightpicindex");

    ViewBag.subtitle = "景点图片管理";
    ViewBag.title = "景点图片管理";
    var id = 0;
    if (ViewBag.current != null)
    {
        id = ViewBag.current.Id;
        ViewBag.sightid = id;
    }
    if (ViewBag.current != null && ViewBag.current.Name != null)
    {
        ViewBag.subtitle = "景点图片管理" + "--" + ViewBag.current.Name;
        ViewBag.title = "景点图片管理";
    }
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<link href="@Url.Content("~/Content/colorbox.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery.colorbox.js")" type="text/javascript"></script>
<input  type="hidden" id = "targetId" name = "targetId" value = "@(id)"/>
<input type="hidden" id="type" name="type" value="景点" />
@{ Html.Telerik().Window()
        .Name("SightAddPicWindow")
        .Title("上传图片")
        .Content(@<text>
    @Html.Partial("_SightPointPicUpload")
    </text>)
        .Width(500)
        .Draggable(true).Modal(true).Visible(false)
        .Render();
}
@{Html.Telerik().Grid(Model)
    .Name("SightPicGrid")
    .ToolBar(toolBar => toolBar.Template(
    @<text>
    @{
        if (Html.HasUiPermission("Pic", "search"))
        {
        <label class="customer-label" for="Customers-input">
            图片名:
        </label>
        <input type="text" id="searchSightPic" value="图片名" data-autocomplete="/pic/search" />
        <input type='button' value='我要搜索' class='t-button' onclick='searchChange()' />
        }
        if (Html.HasUiPermission("Pic", "uploadsight"))
        { 
        <a href='javascript:;' id="sightAddPicLink" class='t-button'>上传图片</a>    
        }
        if (Html.HasUiPermission("Pic", "muldelete"))
        {
        <a href='javascript:;' class='t-button' onclick='mulDelete()'>删除选择项</a>   
        }
    }
    <a href='/sight/detail/@(id)' class='t-button' style="float: right;">
        返回</a>
    </text>))
    .Columns(columns =>
    {
        columns.Template(@<text><input name="selectRow" type="checkbox" value="@item.Id " title="checkedRecords" /></text>)
        .HeaderTemplate(@<text><input type="checkbox" title="选择所有" id="checkAllRecords" /></text>)
        .Width(50).HeaderHtmlAttributes(new { style = "text-align:center" }).HtmlAttributes(new { style = "text-align:center" })
        .ClientTemplate("<input type=\"checkbox\" title=\"check all records\" name = 'selectRow' value = '<#= Id #>'/>");

        columns.Bound(o => o.Id).Width(50).Title("系统Id").Hidden();

        columns.Template(@<text><a href = '@(item.WebFullPath)' title = '@(item.Remark)' class = 'imgView'>
            <img src = '@(item.WebFullPath)' alt = '@(item.Remark)' width = '50px;' height = '50px;' /></a></text>)
        .ClientTemplate("<a href = '<#= WebFullPath #>' title = '<#= Remark#>' class = 'imgView'><img src = '<#= WebFullPath #>' alt = '<#= Remark #>'  width = '50px;' height = '50px;'  /></a>")
        .Title("预览");

        columns.Bound(o => o.SourceName).Width(200).Title("图片名");
        columns.Bound(o => o.Remark).Width(200).Title("图片描述");
        columns.Bound(o => o.Name).Width(200).Template(@<text> <a  href = '@(item.WebFullPath)' title = '@(item.Remark)'  class = 'imgSysView'>@(item.Name)</a>
    </text>)
        .ClientTemplate("<a  href = '<#= WebFullPath #>' title = '<#= Remark #>' class = 'imgSysView'><#= Name #></a>")
        .Title("系统名").ReadOnly();

        columns.Bound(o => o.IpAddress).Width(100).Title("添加IP").ReadOnly();
        columns.Bound(o => o.AddTime).Width(200).Title("添加时间").ReadOnly();
        columns.Bound(o => o.SortNum).Width(100).Title("排序号");
        columns.Bound(o => o.State).Width(100).Title("状态").Hidden();
        columns.Command(comm =>
        {
            if (Html.HasUiPermission("Pic", "edit"))
            {
                comm.Edit().ButtonType(GridButtonType.Text);
            }
            if (Html.HasUiPermission("Pic", "delete"))
            {
                comm.Delete().ButtonType(GridButtonType.Text);
            }
        }).Width(300).Title("编辑/删除");
    })
    .ClientEvents(clientEvents => clientEvents.OnDataBinding("dataBinding")
        .OnDataBound("bindColor").OnEdit("bindColor").OnComplete("bindComplete"))
    .DataKeys(key => key.Add("Id"))//添加主键
    .DataBinding(dataBinding => dataBinding.Ajax().Select("ajaxindex", "pic")
        .Update("edit", "pic", new { targetId = id, type = "景点" })
        .Delete("delete", "pic", new { targetId = id, type = "景点" }))
    .Editable(editing => editing.Mode(GridEditMode.InLine))
    .Pageable(page => page.PageSize(15)).Groupable()
    .Sortable(sort => sort.OrderBy(e => e.Add(s => s.SortNum)))
    .Render();
}
<script type="text/javascript">
    function searchChange() {
        $("#SightPicGrid").data("tGrid").rebind();
    }

    function dataBinding(args) {
        var searchKeyStr = $("#searchSightPic").val();
        var targetId = $('#targetId').val();
        var type = $('#type').val();
        if (searchKeyStr == '图片名') {
            searchKeyStr = '';
        }
        args.data = $.extend(args.data, { targetId: targetId, type: type, searchKey: searchKeyStr });
    }

    function mulDelete() {
        var delStr = $(':checked , #targetId , #type');
        if (delStr.length <= 2) {
            alert('亲，您没有选择任何记录.');
            return;
        }
        jQuery.post('/pic/muldelete', delStr, function (res) {
            if (res.success) {
                setTimeout(function () {
                    $("#SightPicGrid").data("tGrid").rebind();
                    $("#checkAllRecords").attr("checked", false);
                }, 1000);
            } else {
                alert(res.message);
            }
        });
    }

    function bindColor() {
        $(".imgView").colorbox({
            rel: 'imgView',
            slideshow: false
        });

        $(".imgSysView").colorbox({
            rel: 'imgSysView',
            slideshow: false
        });
    }

    function bindComplete(e) {
        $("#SightPicGrid input:checkbox[name='selectRow']").attr("checked", false);
        var success = e.response.success;
        if (success != null && success != undefined) {
            alert(e.response.message);
            window.location.reload();
        }
    }

    $(function () {
        bindColor();
        $("#SightPicGrid input:checkbox[name='selectRow']").attr("checked", false);
        $('#sightAddPicLink').bind('click', function (e) {
            e.preventDefault();
            $('#SightAddPicWindow').data('tWindow').center().open();
        });

        $('#checkAllRecords').click(function checkAll() { $("#SightPicGrid tbody input:checkbox[name='selectRow']").attr("checked", this.checked); });

        $(":input[data-autocomplete]").each(function () {
            $(this).autocomplete({
                source: function (request, response) {
                    var url = '/pic/search/';
                    $.getJSON(url, {
                        term: $.trim(request.term),
                        targetId: $('#targetId').val(),
                        type: $('#type').val()
                    }, response);
                }
            });
        });

        $("#searchSightPic").focus(function () {
            if (this.value == "图片名") {
                $("#searchSightPic").val("");
            }
        }).blur(function () {
            if (this.value == "") {
                $("#searchSightPic").val("图片名");
            }
        });
    });
</script>
